<template>
  <view>
    <!-- 上部分开始 -->
    <view class="topbox">
      <!-- 左侧开始 -->
      <view class="left">
        <image :src="item.images" mode=""></image>
      </view>
      <!-- 左侧结束 -->
      <!-- 右侧开始 -->
      <view class="right">
        <view class="r1">
          <view class="r1-l">
            {{item.name }} 
          </view>
          <view class="r1-r" v-if="item.wage">
            {{item.wage}}元/{{item.workday}}天
            
          </view>
         
        </view>
        <view class="r2" v-if="item.introduce">
          {{item.introduce}}
        </view>
        <view class="buts">
          <view class="button" v-for="(itemson,index) in item.label" :key="index">
             {{itemson}}
           </view>
        </view>
        
      </view>
      <!-- 右侧结束 -->    
    </view>
    <!-- 上部分结束 -->
     <!-- 下部分开始 -->
     <view class="botton1" v-if="item.brief_introduction">
       <view class="">
         <!-- <text v-for="(itemson,index) in item.brief_introduction" :key="index">{{itemson}}</text> -->
         <text>{{item.brief_introduction[0]}}|{{item.brief_introduction[1]}}岁|服务{{item.brief_introduction[2]}}户|评价{{item.brief_introduction[3]}}条</text>
       </view>
     </view>
    
     <view class="botton2" v-else>
       <view class="weizhibox">
         <uni-icons custom-prefix="iconfont" type="weizhi" size="15"></uni-icons>0km
       </view>
       <view class="weizhilength">
         {{item.id}}
       </view>
       <view class="weizhiadd">
         {{item.location}}
       </view>
       
       
     </view>
     <!--下部分结束 -->
    
  </view>
</template>

<script>
  export default {
    name:"my-company-item",
    props:{
      item:{
        type: Object,
        default: [],
      }
    },
    data() {
      return {
        
      };
    }
    // created(){
    //   console.log("测试",this.item);
    // }
  }
</script>

<style lang="scss">
  
  // 上部分
  .topbox{ 
    display: flex;
    padding-left: 40rpx;
  .left{
    height: 172rpx;
    width: 160rpx;
    background-color: greenyellow;
    image{
      height: 172rpx;
      width: 160rpx;
    }
  }
  .right{
    flex: 1;
     padding-left: 40rpx;
    .r1{
      display: flex;
      justify-content: space-between;
      font-size: 28rpx;
      margin-bottom: 26rpx;
      .r1-r{
        color: rgba(151, 145, 145, 1); 
      }
    }
    .r2{
      font-size: 24rpx;
      margin-bottom: 26rpx;
      color: rgba(151, 145, 145, 1);
      
    }
    .buts{
      display: flex;
      .button{
      padding: 0 20rpx;
      border-radius: 1em;
      border: 1px solid #5b6bc0;
      font-size: 24rpx;
      color: #5b6bc0;
      height: 46rpx;
      line-height: 46rpx;
      margin-right: 10rpx;
      }
    }
  }
  }
  // 下部分
  .botton1{
    padding: 20rpx 0 20rpx 40rpx;
    font-size: 28rpx;
    color: rgba(151, 145, 145, 1);
  }

  .botton2{
    padding: 20rpx 0 20rpx 40rpx;
    display: flex;
    align-items: center;
    font-size: 28rpx;
    .weizhilength{
      margin: 0 20rpx;
    }
    .weizhiadd{
      color: rgba(151, 145, 145, 1);
    }
    
  }

</style>